<template>
    <div style="width:800px;margin:0 auto">
        <p>我的留言板</p>
        <table border="1" cellspacing="0" cellpadding="0">
            <thead>
                <td>留言人</td>
                <td>留言主题</td>
                <td>留言内容</td>
                <td>日期</td>
                <td>操作</td>
            </thead>
            <tbody>
                <tr  v-for="(item,index) in msg" :key="index">
                    <td>{{item.email}}</td>
                    <td>{{item.theme}}</td>
                    <td>{{item.content}}</td>
                    <td>{{item.date}}</td>
                    <td><a @click="deleteMsg(index)">删除留言</a></td>
                </tr>
            </tbody>
        </table>
    </div>
</template>
<script>
export default {
    data(){
        return{
            msg:[]
        }
    },
    mounted:function(){
        this.$axios.post("/api/myBlog/myAccount",{
            geter:sessionStorage.getItem("username")
        }).then(res=>{
            this.msg=res.data;
            //console.log(res.data)
        })
    },
    methods:{
        deleteMsg(index){
            this.$axios.get("/api/myBlog/deleteMsg",{
                params:{
                    _id:this.msg[index]._id,
                    geter:sessionStorage.getItem("username")
                }
            }).then(res=>{
               // console.log(res)
                this.msg=res.data
            })
        }
    }
}
</script>
<style scoped>
    p{
        text-align:center;
        color: white;
        font-size: 30px;
        padding-bottom: 7px;
    }
    table{
    color:white;
    width:800px;
    text-align: center;
    margin: 0 auto;
    margin-top: 30px;
    }
    thead td{
        height: 40px;
        background-color: #638663;
    }
    tbody tr{
        height: 35px;
        background-color: #8fa56c;
    }
</style>